<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>

<div>
  <h2 id="show"></h2>
  <input type="text" id="input">
  <button id="btn_send">发送信息</button>
</div>
<script>
  let webSocket = new WebSocket('ws://127.0.0.1:5050');


  btn_send.onclick = function () {
    webSocket.send(JSON.stringify({userId: 1, otherId: 2, msg: input.value.trim(), type: 'msg'}))

  };


  /*
  * 单聊
  * 1. 规则 : userId 点击条目 --> 打开连接
  *  判断数据库有没有这个人  : 有 正常发送 没有 不发送
  * 2. 前端发送 : {userId : 自己, 另一个人 : otherId, type:'open/login/msg'}
  * 3. 后端接收 : {userId: otherId}
  * */

  webSocket.onopen = function () {
    console.log('建立连接');
    webSocket.send(JSON.stringify({userId: 1, msg: input.value.trim(), otherId: 2, type: 'open'}))

  };

  webSocket.onmessage = function (msg) {
    console.log('收到消息');
    let parseData = JSON.parse(msg.data);
    if (parseData.type === 'err') {
      alert('聊天失效')
    }
  };


</script>
</body>
</html>
